/*
 * @Descripttion: GGB
 * @version: 1.0
 * @Author: GGB
 * @Date: 2021-12-06 21:05:54
 * @LastEditors: GGB
 * @LastEditTime: 2021-12-06 21:27:30
 */
import Vue from 'vue'
export const infiniteScroll = Vue.directive('infinite-scroll', {
    bind(el, binding) {
        let target = el;
        if (el.getAttribute('data-scrollTarget')) {
            target = el.querySelector(el.getAttribute('data-scrollTarget'));
        }
        target.addEventListener('scroll', e => {
            const busy = el.getAttribute('data-infiniteScrollDisabled') ? false : true;

            const distance = el.getAttribute('data-infiniteScrollDistance')

                ? Number.parseInt(el.getAttribute('data-infiniteScrollDistance'), 10)

                : 100;
            if (!busy && e.target.scrollHeight - (e.target.scrollTop + e.target.clientHeight) < distance) {

                el.setAttribute('data-infiniteScrollDisabled', true);

                binding.value(e);

            }

        });

    },

});

export const infiniteScrollDisabled = Vue.directive('infinite-scroll-disabled', {
    bind(el, binding) { el.setAttribute('data-infiniteScrollDisabled', binding.value); },
    update(el, binding) { el.setAttribute('data-infiniteScrollDisabled', binding.value); },
});

export const infiniteScrollDistance = Vue.directive('infinite-scroll-distance', {
    bind(el, binding) { el.setAttribute('data-infiniteScrollDistance', binding.value); },
    update(el, binding) { el.setAttribute('data-infiniteScrollDistance', binding.value); },
});